<template>
  <div class="fx1-box">
    <ul class="ul">
      <li v-for="(msg,i) in arr" :key="i" @click="fun(i)">
        <img :src="msg.imgSrc" />
        <p>{{ msg.title }}</p>
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  name: "faxian1",
  data() {
    return {
      arr: [
        {
          imgSrc:
            "//res.vmallres.com/uomcdn/CN/cms/202204/140500291543CA2B15A44764788258C1.png",
          title: "买家秀",
        },
        {
          imgSrc:
            "//res.vmallres.com/uomcdn/CN/cms/202204/847355F1B844E9F1AD550801E7F73010.png",
          title: "0元试用",
        },
        {
          imgSrc:
            "//res.vmallres.com/uomcdn/CN/cms/202204/C052D6F9341E565DE7F447554FEC3EA0.png",
          title: "好物圈",
        },
        {
          imgSrc:
            "//res.vmallres.com/uomcdn/CN/cms/202204/98BEDD82D29BD48A04A32EA41578D573.png",
          title: "发布会回顾",
        },
      ],
    };
  },
  methods:{
    fun(idx){
      if(idx==0){
      this.$router.push("maijiaxiu",idx)
      }

    }
  }
};
</script>

<style scoped>
.fx1-box {
  width: 100%;
  height: 0.75rem;
}
.fx1-box .ul {
  display: flex;
  justify-content: space-evenly;
}
.fx1-box .ul li {
  text-align: center;
  width: 0.6rem;
  margin-top: 0.1rem;
  height: 100%;
}
.fx1-box .ul li img {
  width: 0.4rem;
  height: 0.4rem;
}
.fx1-box .ul li p {
  font-size: 0.12rem;
}
</style>